import React from "react";
import { useState } from "react";
// 复选框基础组件
export default function CheckboxBase(props) {
  const [value, setValue] = useState(props.defaultValue || []);
  const onChange = (e, val) => {
    let newArr = [];
    if (e.target.checked) {
      newArr = [...value, val];
      setValue(newArr);
    } else {
      newArr = value.filter((item) => item !== val);
      // console.log(newArr,val,value);
      setValue(newArr);
    }
    props.onChange && props.onChange(newArr);
  };
  const checkboxes = props.options.map((it) => (
    <label key={it.value}>
      <input
        type="checkbox"
        checked={value.includes(it.value)}
        onChange={(e) => {
          onChange(e, it.value);
        }}
      />
      {it.label}
    </label>
  ));
  return checkboxes;
}
